<html>
    <head>
        <title>MobileCoin Blockchain Explorer</title>
        <link rel="stylesheet" href="{{ url_for('static', filename='css/lofi.css') }}">
        <link rel="shortcut icon" href="{{ url_for('static', filename='favicon.ico') }}">
    </head>
    <body>
        <div class="container">
<div class="center">
<div class="row">********************************************************************************</div>
<div class="row">&nbsp;&nbsp;<a href="/"><</a></div>
<div class="row centered">MobileCoin Blockchain Explorer</div>
<div class="row">&nbsp;</div>
<div class="row centered">
    <a href="/block/{{ block_num - 1 }}">-</a>
    &nbsp;Block {{ block_num }}&nbsp;
    <a href="/block/{{ block_num + 1 }}">+</a>
</div>
<div class="row">&nbsp;</div>
<div class="row">********************************************************************************</div>
<div class="row">&nbsp;</div>
<div class="row">
    <div class="col_16">Size (txos)</div>
    <div class="col_64">{{ txo_count }}</div>
</div>
<div class="row">
    <div class="col_16">Size (kB)</div>
    <div class="col_64">{{ size_of_block }}</div>
</div>
<div class="row">
    <div class="col_16">Hash</div>
    <div class="col_64">{{ block_hash.hex() }}</div>
</div>
<div class="row">
    <div class="col_16">Key Images</div>
    <div class="col_64">{{ key_image_count }}</div>
</div>
<div class="row">&nbsp;</div>

{% if signatures|length %}
<div class="row">********************************************************************************</div>
<div class="row">Signatures</div>
<div class="row">********************************************************************************</div>
<div class="row">&nbsp;</div>
<div class="row">
    <div class="col_30">Url</div>
    <div class="col_15">Signer</div>
    <div class="col_15">Signature</div>
    <div class="col_19">Signed at</div>
</div>
<div class="row">
    <div class="col_30">---</div>
    <div class="col_15">------</div>
    <div class="col_15">---------</div>
    <div class="col_19">---------</div>
</div>
<div class="row">&nbsp;</div>
{%- for signature in signatures %}
    <div class="row">
      <div class="col_30">{{ signature.src_url }}</div>
      <div class="col_15">{{ signature.signature.signer.data.hex()[:5] }}...</div>
      <div class="col_15">{{ signature.signature.signature.data.hex()[:9] }}...</div>
      <div class="col_19">{{ signature.signature.signed_at|datetime }}</div>
    </div>
{%- endfor %}
<div class="row">&nbsp;</div>
{% endif %}

<div class="row">********************************************************************************</div>
<div class="row">Key Images</div>
<div class="row">********************************************************************************</div>
<div class="row">&nbsp;</div>
<div class="row">
    <div class="col_16">n</div>
    <div class="col_64">Key Image</div>
</div>
<div class="row">
    <div class="col_16">-</div>
    <div class="col_64">---------</div>
</div>
<div class="row">&nbsp;</div>
{%- for key_image in key_images %}
    <div class="row">
        <div class="col_16">{{ loop.index }}</div>
        <div class="col_64">{{ key_image.data.hex() }}</div>
    </div>
{%- endfor %}
<div class="row">&nbsp;</div>
<div class="row">********************************************************************************</div>
<div class="row">Transaction Outputs</div>
<div class="row">********************************************************************************</div>
<div class="row">&nbsp;</div>
<div class="row">
    <div class="col_3">n</div>
    <div class="col_13">TXO Field</div>
    <div class="col_64">TXO Data</div>
</div>
<div class="row">
    <div class="col_3">-</div>
    <div class="col_13">---------</div>
    <div class="col_64">--------</div>
</div>
<div class="row">&nbsp;</div>
{%- for txo in txos %}
    <div class="row">
        <div class="col_3">{{ loop.index }}</div>
        <div class="col_13">TXO Pubkey</div>
        <div class="col_64">{{ txo.public_key.data.hex() }}</div>
    </div>
    <div class="row">
        <div class="col_3">&nbsp;</div>
        <div class="col_13">Target Addr</div>
        <div class="col_64">{{ txo.target_key.data.hex() }}</div>
    </div>
    <div class="row">
        <div class="col_3">&nbsp;</div>
        <div class="col_13">Amount</div>
        <div class="col_64">{{ txo.amount.commitment.data.hex() }}</div>
    </div>
    <div class="row">&nbsp;</div>
{%- endfor %}
<div class="row">&nbsp;</div>
</div>
        </div>
    </body>
</html>
